<template>
	<view class="technician-pages-mine"
		:style="{background:(!configInfo.plugAuth.coachport||(coachInfo.id != -1 && [2,3].includes(coachInfo.status))) ?pageColor:''}">
		<!-- #ifndef H5 -->
		<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" color="#000"
			:backgroundColor="pageScrollTop>1?'#D4FADB':''">
		</uni-nav-bar>
		<!-- #endif -->
		<block v-if="!configInfo.plugAuth.coachport">
			<abnor type="NOT_AUTH" :isCenter="true"></abnor>
		</block>
		<block v-if="configInfo.plugAuth.coachport && coachInfo && coachInfo.id">
			<!-- 技-师 -->
			<!-- coach_status 1申请中，2已通过，3已取消授权，4已拒绝 -->
			<image mode="aspectFill" lazy-load class="mine-bg abs" :src="configInfo.coach_image"></image>
			<!-- #ifdef H5 -->
			<view class="rel" style="padding:50rpx 28rpx 0 28rpx">
			<!-- #endif -->
				<!-- #ifndef H5 -->
				<view class="rel" style="padding:100rpx 28rpx 0 28rpx">
				<!-- #endif -->
					<!-- #ifdef MP-WEIXIN -->
					<view class="flex-between" style="height:68rpx">
					<!-- #endif -->
						<!-- #ifndef MP-WEIXIN -->
						<view class="flex-between rel" style="height:48rpx;z-index: 9999;">
						<!-- #endif -->
							<view></view>
							<!-- #ifndef MP-WEIXIN -->
							<view class="flex-center">
								<view class="mr-lg rel" v-if="configInfo.plugAuth.im&&coachInfo.user_id">
									<view class="abs flex-center f-icontext c-base"
										style="top:-4rpx;height: 28rpx; background: #F1381F; border-radius: 14rpx;"
										:style="{width:coachInfo.massage_count<10 ? '30rpx' :coachInfo.massage_count<100 ? '40rpx' : '50rpx',right:coachInfo.massage_count<10 ? '-10rpx' :coachInfo.massage_count<100 ? '-20rpx' : '-30rpx'}"
										v-if="coachInfo.massage_count*1>0">
										<view style="transform: scale(0.9);">
											{{coachInfo.massage_count < 100 ? coachInfo.massage_count : '99+'}}
										</view>
									</view>
									<i @tap.stop="$util.goUrl({url:`/im/pages/list?type=2`})"
										class="iconfont iconxiaoxi1" style="font-size: 48rpx;"
										:style="{color:configInfo.coach_font_color}"></i>
								</view>
								<i @tap.stop="$util.goUrl({url:`/technician/pages/setting`})"
									class="iconfont iconshezhi2" style="font-size: 48rpx;"
									:style="{color:configInfo.coach_font_color}"></i>
							</view>
							<!-- #endif -->
						</view>
						<view class="rel" @tap.stop="toEditInfo">
							<view class="cancel-auth iconfont icon-biaoqian c-caption flex-center abs"
								v-if="coachInfo.status == 3">
								<view class="text-bold f-icontext abs">取消授权</view>
							</view>
							<view class="flex-warp">
								<view class="coach-info flex-center flex-1">
									<image mode="aspectFill" class="avatar radius"
										:src="coachInfo.work_img || `https://api.huixuananmm.com/admin/anmo/technician/default_technician.png`">
									</image>
									<view class="flex-1" style="margin-left: 28rpx;"
										:style="{color:configInfo.coach_font_color}">
										<view class="f-sm-title text-bold max-300 ellipsis">
											{{coachInfo.coach_name || '-'}}
										</view>
										<view class="f-paragraph" style="margin-top: 12rpx;opacity: 0.7;">
											ID：{{coachInfo.id}}
										</view>
									</view>
								</view>
								<!-- #ifdef MP-WEIXIN -->
								<view class="mr-lg rel" v-if="configInfo.plugAuth.im&&coachInfo.user_id">
									<view class="abs flex-center f-icontext c-base"
										style="top:-4rpx;height: 28rpx; background: #F1381F; border-radius: 14rpx;"
										:style="{width:coachInfo.massage_count<10 ? '30rpx' :coachInfo.massage_count<100 ? '40rpx' : '50rpx',right:coachInfo.massage_count<10 ? '-10rpx' :coachInfo.massage_count<100 ? '-20rpx' : '-30rpx'}"
										v-if="coachInfo.massage_count*1>0">
										<view style="transform: scale(0.9);">
											{{coachInfo.massage_count < 100 ? coachInfo.massage_count : '99+'}}
										</view>
									</view>
									<i @tap.stop="$util.goUrl({url:`/im/pages/list?type=2`})"
										class="iconfont iconxiaoxi1" style="font-size: 48rpx;"
										:style="{color:configInfo.coach_font_color}"></i>
								</view>
								<i @tap.stop="$util.goUrl({url:`/technician/pages/setting`})"
									class="iconfont iconshezhi2" style="font-size: 48rpx;"
									:style="{color:configInfo.coach_font_color}"></i>
								<!-- #endif -->
							</view>

							<view class="renzheng-info flex-center radius-16 rel"
								:class="[{'is-renzheng':coachInfo.auth_status==2}]">
								<i class="iconfont iconziliao"></i>
								<view class="flex-1 flex-between ml-sm f-paragraph">
									<view>
										{{['真人认证 完善资料才可上线接单','认证审核中','已认证 · 修改资料需重新审核','认证已驳回'][coachInfo.auth_status]}}
									</view>
									<i class="iconfont icon-right" style="font-size: 24rpx;"
										v-if="[1,2].includes(coachInfo.auth_status)"></i>
									<view class="edit-btn flex-center text-bold radius" v-else>
										{{coachInfo.auth_status===0?'去完成':'去修改'}}
									</view>
								</view>
							</view>
						</view>

						<view class="service-carfee-info flex-between font-num">
							<view @tap.stop="$util.goUrl({ url: `/technician/pages/income/index?type=2`})"
								class="list-item">
								<view class="item-img rel">
									<image class="item-img"
										:src="`https://api.huixuananmm.com/admin/anmo/coachport/order-service.png`">
									</image>
									<view class="abs f-mini-title text-bold">服务收入</view>
								</view>
								<view class="item-content">
									<view class="flex-y-baseline f-title c-title">¥<view class="price">
											{{coachInfo.service_price || 0}}
										</view>
									</view>
									<view class="f-desc c-caption">可提现</view>
									<view class="cash-btn flex-center f-mini-title c-base radius">去提现</view>
								</view>
							</view>
							<view @tap.stop="$util.goUrl({ url: `/technician/pages/income/index?type=3`})"
								class="list-item carfee">
								<view class="item-img rel">
									<image class="item-img"
										:src="`https://api.huixuananmm.com/admin/anmo/coachport/order-carfee.png`">
									</image>
									<view class="abs f-mini-title text-bold">订单车费</view>
								</view>
								<view class="item-content">
									<view class="flex-y-baseline f-title c-title">¥<view class="price">
											{{coachInfo.car_price || 0}}
										</view>
									</view>
									<view class="f-desc c-caption">可提现</view>
									<view class="cash-btn flex-center f-mini-title c-base radius">去提现</view>
								</view>
							</view>
						</view>
						<view class="fill-base radius-16" style="margin-top: 28rpx;">
							<view class="f-title text-bold" style="padding: 24rpx 28rpx">个人档案</view>
							<view class="tool-list flex-warp pb-sm">
								<view @tap.stop="toJump('toolList',index)"
									class="tool-item flex-center flex-column mb-lg" v-for="(item,index) in toolList"
									:key="index">
									<view class="record-img rel">
										<image class="record-img"
											:src="`https://api.huixuananmm.com/admin/anmo/coachport/${item.icon}.png`">
										</image>
										<view class="fdd-tag flex-center f-little c-base radius abs"
											v-if="item.text =='电签合同' && (coachInfo.fdd_status == 1 || coachInfo.is_fxq == 0)">
											待签约</view>
									</view>
									<view class="f-caption c-title">{{item.text}}</view>
								</view>
								<!-- #ifdef MP-WEIXIN-USER || H5-USER -->
								<view @tap.stop="toUserPort" class="tool-item flex-center flex-column mb-lg"
									v-if="coachInfo.user_id">
									<image class="record-img"
										:src="`https://api.huixuananmm.com/admin/anmo/coachport/change.png`">
									</image>
									<view class="f-caption c-title">切换用户端</view>
								</view>
								<!-- #endif -->
								<!-- #ifdef APP-PLUS -->
								<view @tap.stop="toUserPort" class="tool-item flex-center flex-column mb-lg"
									v-if="is_app_user == 1 && coachInfo.user_id">
									<image class="record-img"
										:src="`https://api.huixuananmm.com/admin/anmo/coachport/change.png`">
									</image>
									<view class="f-caption c-title">切换用户端</view>
								</view>
								<!-- #endif -->

							</view>
						</view>
					</view>

					<view class="space-lg"></view>
					<view :style="{height: `${configInfo.tabbarHeight}px`}"></view>
					<longbingbing-tabbar tabType="coachTabBar" :cur="4"></longbingbing-tabbar>
		</block>


		<uni-popup ref="auth_status_item" type="top" :maskClick="false" :custom="true">
			<!-- #ifdef MP-WEIXIN -->
			<view style="height:554rpx"></view>
			<!-- #endif -->
			<!-- #ifdef APP-PLUS -->
			<view style="height:534rpx"></view>
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view style="height:484rpx"></view>
			<!-- #endif -->
			<view class="popup-authstatus">
				<view class="flex-between" style="padding:0 28rpx">
					<view></view>
					<view>
						<view class="auth-content rel">
							<view class="f-title c-base text-bold">完善资料</view>
							<view class="f-paragraph c-base mt-sm">需补充剩余资料才可以线上接单哟～</view>
							<view class="flex-between" style="margin-top: 15rpx;">
								<view></view>
								<view @tap.stop="$refs.auth_status_item.close();auth_popup=true"
									class="auth-btn flex-center fill-base f-mini-title text-bold radius">知道了</view>
							</view>
							<image class="tips-line abs"
								:src="`https://api.huixuananmm.com/admin/anmo/coachport/tips-line.png`">
							</image>
							<image class="tips-icon abs"
								:src="`https://api.huixuananmm.com/admin/anmo/coachport/tips-icon.png`">
							</image>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>

		<!-- #ifdef MP-WEIXIN -->
		<user-privacy ref="user_privacy" :show="false"></user-privacy>
		<!-- #endif -->
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	export default {
		components: {},
		data() {
			return {
				isLoad: false,
				options: {},
				lockTap: false,
				auth_popup: false,
				toolList: [{
						icon: 'level',
						text: '等级管理',
						url: '/technician/pages/level'
					},
					{
						icon: 'order-eval',
						text: '订单评价',
						url: '/technician/pages/order/evaluate'
					},
					{
						icon: 'fankui',
						text: '差评申诉',
						url: '/technician/pages/bad-comments/box'
					},
					{
						icon: 'shield',
						text: '拉黑用户',
						url: '/technician/pages/shield'
					},
					{
						text: '我的推广码',
						icon: 'shield',
						url: '/technician/pages/fenxiao/tuiguang'
					},
					{
						text: '分销推广',
						icon: 'shield',
						url: '/technician/pages/fenxiao/rate'
					}
				]
			}
		},
		computed: mapState({
			configInfo: state => state.config.configInfo,
			haveOperItem: state => state.order.haveOperItem,
		}),
		async onLoad(options) {
			this.options = options
			this.$util.setNavigationBarColor({
				bg: '#ffffff',
				color: '#000000'
			})
			this.initIndex()
		},
		onShow() {
			uni.setNavigationBarTitle({
				title: '我的'
			})
			if (this.isRegister) {
				this.initRefresh()
				return
			}
			let {
				haveOperItem
			} = this
			let {
				status: coach_status = 0,
			} = this.coachInfo
			if (haveOperItem && [2, 3].includes(coach_status)) {
				this.updateOrderItem({
					key: 'haveOperItem',
					val: false
				})
			}
			if (this.isLoad) {
				this.getCoachInfo()
			}
		},
		async onPullDownRefresh() {
			// #ifndef APP-PLUS
			uni.showNavigationBarLoading()
			// #endif
			await this.initRefresh()
			uni.stopPullDownRefresh()
		},
		methods: {
			...mapActions(['getConfigInfo', 'getCoachInfo', ]),
			...mapMutations(['updateUserItem', 'updateOrderItem']),
			async initIndex(refresh = false) {
				if (!this.configInfo.id || refresh || !this.userInfo.id) {
					await this.getConfigInfo()
				}
				await this.getCoachInfo()
				await this.changeToTechnician()
				let {
					status: coach_status = 0,
					auth_status = 0,
					coach_position = 0
				} = this.coachInfo
				let {
					auth_popup = false
				} = this
				if (coach_status == 2 && !auth_status && !auth_popup) {
					this.$refs.auth_status_item.open()
				}
				this.$util.hideAll()
				this.isLoad = true

				// #ifdef MP-WEIXIN
				let privacyCheck = this.$refs.user_privacy.check()
				if (privacyCheck) {
					this.$refs.user_privacy.open()
					return
				}
				// #endif

				// #ifdef H5
				if (!refresh) {
					this.$jweixin.hideOptionMenu()
				}
				if (coach_position && coach_status == 2) {
					this.$util.getCoachUtilLoca()
				}
				// #endif
			},
			initRefresh() {
				this.initIndex(true)
			},
			async changeToTechnician() {
				let {
					id,
					status: coach_status,
					sh_text = ''
				} = this.coachInfo
				if (coach_status == 4 && sh_text) {
					this.tipArr[4][0].text = sh_text
				}
				if (id == -1) {
					this.updateUserItem({
						key: 'coachInfo',
						val: {
							work_img: `https://api.huixuananmm.com/admin/anmo/mine/default-user.png`
						}
					})
				}
				let {
					fdd_auth_status,
					fxq_auth_status,
					user_id = 0
				} = this.coachInfo

				let {
					plugAuth,
				} = this.configInfo

				let {
					materialshop = false,
						dynamic = false,
						coachcredit = false,
						adapay = false,
						heepay = false,
						dispatchother = false
				} = plugAuth

				let textArr = [{
						icon: 'shop',
						text: '物料商城',
						url: '/technician/pages/shop/list',
						join: '差评申诉'
					}, {
						icon: 'dynamic',
						text: '动态发布',
						url: '/dynamic/pages/technician/list',
						join: '差评申诉'
					}, {
						icon: 'sign',
						text: '电签合同',
						url: '',
						join: '等级管理'
					}, {
						icon: 'wages',
						text: '我的工价',
						url: '/technician/pages/wages',
						join: '差评申诉'
					}, {
						icon: 'credit',
						text: '我的信用分',
						url: '/technician/pages/credit',
						join: '差评申诉'
					},
					{
						icon: 'cash-bind',
						text: '提现绑定',
						url: '/technician/pages/account/bind',
						join: '差评申诉'
					}
				]

				let isBind = true
				// #ifdef MP-WEIXIN
				if (!adapay && !heepay) {
					isBind = false
				}
				// #endif
				if (!user_id) {
					isBind = false
				}
				textArr.map(item => {
					let {
						text,
						join
					} = item
					let ind = this.toolList.findIndex(aitem => {
						return text == aitem.text
					})
					if (ind != -1) {
						this.toolList.splice(ind, 1)
					}
					if (item.join) {
						delete item.join
					}
					let joinInd = this.toolList.findIndex(aitem => {
						return join == aitem.text
					})
					if ((text == '物料商城' && materialshop) || (text == '动态发布' && dynamic) || (text == '电签合同' &&
							(fdd_auth_status || fxq_auth_status)) || (text ==
							'我的信用分' && coachcredit) || (text == '提现绑定' && isBind) || (text == '我的工价' &&
							dispatchother)) {
						this.toolList.splice(joinInd, 0, item)
					}
				})
				console.log('标记2',this.toolList)
			},
			toJump(key, index) {
				let {
					id = 0,
						url,
						text
				} = this[key][index]
				console.log(text, url)
				let {
					fdd_auth_status,
					fxq_auth_status
				} = this.coachInfo
				if (text == '电签合同') {
					if (fdd_auth_status) {
						this.toFddSign()
					}
					if (fxq_auth_status) {
						this.toFxqSign()
					}
					return
				}
				this.$util.goUrl({
					url
				})
			},
			toEditInfo() {
				let {
					status,
					auth_status,
					fdd_auth_status,
					fdd_status
				} = this.coachInfo
				if (status == 2 && (fdd_auth_status && fdd_status === 1)) {
					this.$util.showToast({
						title: `请先签订合同哦`
					})
					return
				}
				let {
					auth_popup
				} = this
				if (!auth_status && !auth_popup) {
					this.$refs.auth_status_item.close()
				}
				this.$util.goUrl({
					url: `/technician/pages/edit`
				})
			},
			async toFddSign() {
				await this.getCoachInfo()
				this.updateUserItem({
					key: 'fddExtsign',
					val: ''
				})
				let {
					status: coach_status,
					admin_id = 0,
					fdd_agreement = {},
					fdd_status
				} = this.coachInfo
				this.$util.showLoading()

				let {
					viewpdf_url = ''
				} = fdd_agreement && fdd_agreement.hasOwnProperty('viewpdf_url') ? fdd_agreement : {
					viewpdf_url: ''
				}
				if (!viewpdf_url || fdd_status == 1) {
					if (coach_status == 3) {
						this.$util.showToast({
							title: `平台管理员已取消授权，不能签约哦`
						})
						return
					}
					let fddRecord = await this.$api.technician.getFddRecord()
					if (!fddRecord) {
						this.updateUserItem({
							key: 'personVerifyUrl',
							val: ''
						})
						let {
							status
						} = await this.$api.technician.getAttestationInfo()
						if (status < 2) {
							let personVerifyUrl = await this.$api.technician.getPersonVerifyUrl()
							this.$util.hideAll()
							this.updateUserItem({
								key: 'personVerifyUrl',
								val: personVerifyUrl
							})
							// #ifdef H5
							window.location.href = personVerifyUrl
							// #endif
							// #ifndef H5
							this.$util.goUrl({
								url: `/user/pages/common/web?url=personVerifyUrl`
							})
							// #endif
							return
						} else {
							let Extsign = await this.$api.technician.Extsign({
								admin_id
							})
							viewpdf_url = Extsign
						}
					}
				}
				this.$util.hideAll()
				this.updateUserItem({
					key: 'fddExtsign',
					val: viewpdf_url
				})
				// #ifdef H5
				window.location.href = viewpdf_url
				// #endif
				// #ifndef H5
				this.$util.goUrl({
					url: `/user/pages/common/web?url=fddExtsign`
				})
				// #endif 
			},
			// 放心签
			async toFxqSign() {
				await this.getCoachInfo()
				let {
					is_fxq,
					is_fxq_check,
					id_code,
					true_user_name: name = '',
				} = this.coachInfo
				if (!is_fxq_check) {
					this.$util.goUrl({
						url: `/technician/pages/fxq/real-name`
					})
					return
				}
				this.$util.goUrl({
					url: `/technician/pages/fxq/index`
				})
			},
			//表单验证
			validate(param) {
				let validate = new this.$util.Validate();
				this.subRule.map(item => {
					let {
						name,
					} = item
					validate.add(param[name], item);
				})
				let message = validate.start();
				return message;
			},
			// 去申请/再次申请
			async confirm() {
				let {
					status: coach_status = -1
				} = this.coachInfo
				if (coach_status == 1) return
				this.$util.goUrl({
					url: `/technician/pages/apply`
				})
			},
			// 切换用户端
			toUserPort() {
				let {
					coach_account_login = 0
				} = this.userInfo
				if (coach_account_login) {
					this.updateUserItem({
						key: 'userInfo',
						val: {}
					})
					this.updateUserItem({
						key: 'autograph',
						val: ''
					})
				}
				this.$util.goUrl({
					url: `/pages/mine`
				})
			},
		}
	}
</script>

<style lang="scss">
	.technician-pages-mine {
		.popup-authstatus {
			width: 750rpx;

			.auth-content {
				width: 440rpx;
				height: 285rpx;
				background: linear-gradient(314deg, #B366FF 0%, #66B3FF 100%);
				border-radius: 30rpx;
				padding: 28rpx;

				.tips-line {
					width: 32rpx;
					height: 93rpx;
					top: -90rpx;
					right: 78rpx;
				}

				.tips-icon {
					width: 138rpx;
					height: 130rpx;
					left: -33rpx;
					bottom: -29rpx;
				}

				.auth-btn {
					width: 184rpx;
					height: 72rpx;
					color: #9059FF;
				}
			}
		}

		.mine-bg {
			width: 100%;
			height: 500rpx;
			z-index: 0;
		}

		.cancel-auth {
			width: 110rpx;
			height: 100rpx;
			font-size: 100rpx;
			top: 80rpx;
			right: 80rpx;

			.text-bold {
				height: 33rpx;
				transform: rotate(-32deg);
			}
		}

		// 技-师信息
		.coach-info {
			margin: 0 12rpx;

			.avatar {
				width: 160rpx;
				height: 160rpx;
				border: 4rpx solid #fff;
			}

			.h5-image.avatar {
				width: 100%;
				height: 100%;
				border: none;
			}
		}

		.renzheng-info {
			width: 100%;
			height: 88rpx;
			margin-top: 40rpx;
			padding: 0 24rpx;
			color: #fff;
			background: linear-gradient(135deg, #3DCC9C 0%, #29CCCC 100%);
			z-index: 999;

			.iconziliao {
				font-size: 40rpx;
			}

			.edit-btn {
				width: 132rpx;
				height: 56rpx;
				background: rgba(0, 102, 96, 0.5);
			}
		}

		.is-renzheng {
			color: #00B395;
			background: #CEEFE9;
		}

		.service-carfee-info {
			margin-top: 28rpx;

			.list-item {
				.item-img {
					width: 337rpx;
					height: 100rpx;

					.abs {
						top: 38rpx;
						left: 28rpx;
						color: #2E9940;
					}
				}

				.item-content {
					width: 337rpx;
					height: 250rpx;
					padding: 28rpx;
					background: linear-gradient(225deg, #D4FADB 0%, #FFFFFF 100%);
					border-radius: 0 0 16rpx 16rpx;

					.price {
						font-size: 48rpx;
					}

					.cash-btn {
						width: 160rpx;
						height: 68rpx;
						background: #43A960;
						margin-top: 16rpx;
					}
				}
			}

			.list-item.carfee {
				.item-img {
					.abs {
						color: #DE852C;
					}
				}

				.item-content {
					background: linear-gradient(225deg, #FFF9D9 0%, #FFFFFF 100%);

					.cash-btn {
						background: #FFB433;
					}
				}
			}
		}

		.tool-list {
			.tool-item {
				width: 25%;

				.record-img {
					width: 80rpx;
					height: 80rpx;

					.fdd-tag {
						top: 0;
						right: -40rpx;
						width: 80rpx;
						height: 34rpx;
						background: #FF002B;
						border: 2rpx solid #FFFFFF;
					}
				}
			}
		}
	}
</style>